<template>

<div class="container">
  <div class="photos">
    <img src="../../assets/one.png" alt="">
    <img src="../../assets/two.png" alt="">
    <img src="../../assets/three.png" alt="">
    <img src="../../assets/four.png" alt="">
  </div>
  <div class="top">
  <div class="a"><CaiWu></CaiWu></div>
  <div class="b"><XueYuan></XueYuan></div>
  </div>
  <div class="middle">
 <div class="c"><DaiBan></DaiBan></div>
  <div class="d"><KeCheng></KeCheng></div>
  </div>
  <div class="bottom">
  <div class="e"><MingXing></MingXing></div>
  <div class="f"><TouTiao></TouTiao></div>
  </div>
</div>
</template>





<script>





import CaiWu from './components/CaiWu'
import DaiBan from './components/DaiBan'
import KeCheng from './components/KeCheng'
import MingXing from './components/MingXing'
import TouTiao from './components/TouTiao'
import XueYuan from './components/XueYuan'


export default {
  data(){
    return{
     
    }
  },
   components:{
       CaiWu,DaiBan,KeCheng,MingXing,TouTiao,XueYuan
   }
}
</script>

<style scoped lang="less">
  .home{background-color: #D4DFF6;}
  .photos{
    display: flex;
    justify-content: space-between;
    margin-bottom: 20px;
  }
  img{
    width: 24%;
  }
  .top,.middle,.bottom{
    width: 100%;
    margin-bottom: 16px;
    display: flex;
    justify-content: space-between;
  }
  .a,.b,.c,.d,.e,.f{
    background-color: white;
  }
  .a,.b,.c,.d{width: 49.4%;}
  .e{width:43%;}
  .f{width:56%;}
  .bottom{margin-bottom: 0;}
</style>